<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="StyleSheet" href="../../css/mypetstore.css" type="text/css" media="screen"/>
</head>
<body>
<div th:replace="/jsp/common/top"></div>
<div id="Content">
<div id="Catalog">
  <span th:if="${session.messageOrder!=null}">
    <p style="color: red" th:text="${session.messageOrder}"></p>
  </span>
  <form action="/order/newOrderOk" method="post">

    <h2>Delivery Address</h2>

    <table>
      <tr>
        <td id="AddressInfo">AddressInfo</td>
        <td id="DetailInfo">DetailInfo</td>
      </tr>
    </table>

    <table id="AddressTable">
      <tr>
        <td><b>Receiver FirstName</b></td>
        <td>
          <input type="text" name="receiverFirstName">
        </td>
      </tr>
      <tr>
        <td><b>Receiver LastName</b></td>
        <td>
          <input type="text" name="receiverLastName">
        </td>
      </tr>
      <tr>
        <td><b>ShipTo Address1</b></td>
        <td>
          <input type="text" name="shipToAddress1">
        </td>
      </tr>
      <tr>
        <td><b>ShipTo Address2</b></td>
        <td>
          <input type="text" name="shipToAddress2">
        </td>
      </tr>
      <tr>
        <td><b>Notes</b></td>
        <td>
          <input type="text" name="notes">
        </td>
      </tr>
    </table>

    <table id="DetailTable" HIDDEN="hidden">
      <tr>
        <td><b>Phone Number</b></td>
        <td>
          <input type="text" name="phoneNumber">
        </td>
      </tr>
      <tr>
        <td><b>Bill Country</b></td>
        <td>
          <input type="text" name="billCountry">
        </td>
      </tr>
      <tr>
        <td><b>Ship Time</b></td>
        <td>
          <input type="text" name="shipTime">
        </td>
      </tr>
      <tr>
        <td><b>Zip</b></td>
        <td>
          <input type="text" name="zip">
        </td>
      </tr>
      <tr>
        <td><b>CreditCard</b></td>
        <td>
          <input type="text" name="creditCard">
        </td>
      </tr>
    </table>

    <h2>Cart List</h2>
    <table>
      <tr>
        <th><b>Item ID</b></th>
        <th><b>Product ID</b></th>
        <th><b>Description</b></th>
        <th><b>In Stock?</b></th>
        <th><b>Quantity</b></th>
        <th><b>List Price</b></th>
        <th><b>Total Cost</b></th>
      </tr>

        <tr th:each="vo:${VOList}">
          <td>
            <a th:href="@{/catalog/viewItem(itemId=${vo.cartItem.item.itemid})}" th:text="${vo.cartItem.item.itemid}"></a>
          </td>
          <td th:text="${vo.cartItem.item.getProductid()}">productid</td>
          <td>
            <span th:if="${vo.cartItem.item.attr1 != null}" th:text="${vo.cartItem.item.attr1}"></span>
            <span th:if="${vo.cartItem.item.attr2 != null}" th:text="${vo.cartItem.item.attr2}"></span>
            <span th:if="${vo.cartItem.item.attr3 != null}" th:text="${vo.cartItem.item.attr3}"></span>
            <span th:if="${vo.cartItem.item.attr4 != null}" th:text="${vo.cartItem.item.attr4}"></span>
            <span th:if="${vo.cartItem.item.attr5 != null}" th:text="${vo.cartItem.item.attr5}"></span>
            <span th:text="${vo.productName}"></span>
          </td>
          <td th:text="${vo.cartItem.inStock}">inStock</td>
          <td th:text="${vo.cartItem.quantity}">quantity</td>
          <td th:text="${vo.cartItem.item.getListprice()}">List Price</td>
          <td th:text="${vo.cartItem.total}">List Price</td>
        </tr>
    </table>

    <table>
      <tr>
        <td><b>TOTAL COST:</b></td>
        <td th:text="${subTotal}">subTotal</td>
        <td><input type="submit" value="ORDER NOW!"></td>
      </tr>
    </table>

  </form>
</div>
</div>
<div th:replace="/jsp/common/bottom"></div>

<script src="../../../static/js/Order/orderSelect.js"></script>

</body>
</html>